import React from 'react';
import {connect} from 'react-redux';
import {Icon, Dropdown, Menu, Row, Col, Divider, Radio, Button, Form, message} from 'antd';
import {messages} from 'share/common';
import subApplicationService from "containers/new-sub-application/new-sub-application.service";
import 'styles/main/components/user-info.scss';

class SeniorSetting extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: {
        "2": [
          {
            name: messages('basic-9.key6')/*单据动态*/,
            description: messages('basic-9.key7')/*一览近期单据动态*/,
            key: "enableDocstatus",
          },
          {
            name: messages('basic-9.key8')/*商务出行*/,
            description: "",
            key: "enableBusinessTravel",
          },
          {
            name: messages('basic-9.key9')/*快速创建*/,
            description: messages('basic-9.key10')/*快速创建单据或费用*/,
            key: "enableFastitem",
          }
        ],
        "3": [
          // {
          //   name: messages('basic-9.key113')/*信用积分*/,
          //   key: "CREDIT",
          // },
          // {
          //   name: messages('basic-9.key114')/*订单信息*/,
          //   key: "enableOrderInfo",
          // },
          {
            name: messages('basic-9.key11')/*设置*/,
            key: "setting",
            children: [
              {
                name: messages('basic-9.key125')/*账户与安全-注销账号*/,
                key: "enableAccountCancellation",
              }, {
              name: messages('basic-9.key12')/*账户与安全-修改登录密码*/,
              key: "enableSecuritypassword",
            }, {
              name: messages('basic-9.key13')/*新消息通知*/,
              key: "enableMessage",
            }]
          }, {
            name: messages('basic-9.key14')/*帮助与反馈*/,
            key: "enableFeedback",
            children: [
            {
              name: messages('basic-9.key115')/*操作手册*/,
              key: "enableOperationDoc",
            },{
              name: messages('basic-9.key16')/*新手指导*/,
              key: "enableGuide",
            }, {
              name: messages('basic-9.key15')/*在线客服*/,
              key: "enableCustomerservice",
            },{
              name: messages('basic-9.key17')/*联系我们*/,
              key: "enableFeedbackContactus",
            }, {
              name: messages('basic-9.key116')/*问题反馈*/,
              key: "enableProblemFeedback",
          }]
          }, {
            name: messages('basic-9.key18')/*关于我们*/,
            key: "enableAboutus",
            children: [{
              name: messages('basic-9.key17')/*联系我们*/,
              key: "enableContactus",
            }]
          }
        ],
      },
      checkedValues: {},
      loading: false,
    };
  }

  componentWillMount(){
    this.getConfigDetail();
  }

  getConfigDetail = () => {
    const {data} = this.state;
    subApplicationService.getHomePageCardDetail().then(res => {
      let checkedValues = res.data;
      if(res && res.data && res.data.widgetList){
        (res.data.widgetList || []).map(item => {
          // if(item.appCode === "CREDIT"){
          //   data["3"][0].name = item.appName;
          //   checkedValues.CREDIT = item.isEnabled;
          // }
          if(item.appCode === "FEEDBACK"){
            data["3"][1].name = item.appName;
          }
        })
      }
      this.setState({
        checkedValues,
        data,
      });
    }).catch(err => {

    })
  };

  onChange = (e, item) => {
    let {checkedValues} = this.state;
    checkedValues[item.key] = e.target.value;
    this.setState({
      checkedValues,
    });
  };

  handleSave = () => {
    this.setState({
      loading: true,
    });
    let {checkedValues} = this.state;
    if(checkedValues.widgetList){
      (checkedValues.widgetList || []).map(item => {
        if(item.appCode === "CREDIT"){
          item.isEnabled = checkedValues.CREDIT;
        }
      })
    }
    subApplicationService.editHomePageCardDetail(checkedValues)
      .then(res => {
        this.setState({
          loading: false,
        });
        message.success(messages('basic-9.key1')/*保存成功！*/);
        this.props.close();
    }).catch(err => {
      this.setState({
        loading: false,
      })
    });
  };

  onCancel = () => {
    this.props.close();
  };

  render() {
    let {data, checkedValues, loading} = this.state;
    const {authPolicyAll} = this.props;
    let nameStyle = {
      width: 300, color: "rgb(41, 39, 39)", fontSize: 16, fontWeight: 600, display: "inline-block",};
    let childNameStyle = {
      width: 300, color: "rgba(0,0,0,0.85)", display: "inline-block", marginTop: 20
    };
    let {activeKey} = this.props.params;
    let currentMenu = this.props.currentMenuPermission.currentMenu || {};
    let disabled = !authPolicyAll || currentMenu.operationType === "R";
    return (
      <div>
        {
          data[activeKey].map((item, index) => {
          return (
            <div key={index}>
              <div>
                <span style={nameStyle}>
                  {item.name}
                  {
                    activeKey === "2" &&
                    <div style={{color: "rgba(0, 0, 0, 0.5)", fontSize: 14, fontWeight: 400}}>{item.description}</div>
                  }
                </span>
                {
                  ((item.key !== "setting" && item.key !== "enableFeedback") || activeKey === "2") &&
                  <Radio.Group onChange={(e) => this.onChange(e, item)}
                               value={checkedValues[item.key]}
                               style={activeKey === "2" ? {verticalAlign: "top"} : {}}>
                    <Radio value={true}>{messages('basic-9.key117')/*开启*/}</Radio>
                    <Radio value={false}>{messages('basic-9.key118')/*关闭*/}</Radio>
                  </Radio.Group>
                }
              </div>
              {
                (((["enableAboutus"].indexOf(item.key) !== -1) && checkedValues[item.key]) ||
                  (["CREDIT", "enableAboutus"].indexOf(item.key) === -1)) &&
                item.children && item.children.map(child => {
                  return (
                    <div key={child.key}>
                      <span style={childNameStyle}>{child.name}</span>
                      <Radio.Group onChange={(e) => this.onChange(e, child)} value={checkedValues[child.key] || false}>
                        <Radio value={true}>{messages('basic-9.key117')/*开启*/}</Radio>
                        <Radio value={false}>{messages('basic-9.key118')/*关闭*/}</Radio>
                      </Radio.Group>
                    </div>
                  )
                })
              }
              <Divider/>
            </div>
          )
        })
        }
        <div className="slide-footer">
          <Button type="primary" onClick={this.handleSave} disabled={disabled} loading={loading}>
            {messages('common.save')/*保存*/}
          </Button>
          <Button onClick={this.onCancel}>{messages('common.cancel')/*取消*/}</Button>
        </div>
      </div>
    )
  }
}

SeniorSetting.propTypes = {
  loginUser: React.PropTypes.any,
  menuRouterDeal: React.PropTypes.any,
};

SeniorSetting.defaultProps = {};

SeniorSetting.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps(state) {
  return {
    currentMenuPermission: state.main.currentMenuPermission,
    authPolicyAll: state.main.authPolicyAll,
  }
}

export default connect(mapStateToProps)(SeniorSetting);

